var last = document.querySelector(".last");
var next = document.querySelector(".next");
var box = document.querySelector(".show_cabinet div");
var speed = 0;
var t = null;
function  move( dom , attr , target ){
    // 我们对于透明度的处理是让透明度的值扩大100倍; 
    if( attr === "opacity"){
          var now_attr = parseInt( getComputedStyle(dom)[attr] * 100 );
          //  now_attr : 100 

          target *= 100;
          // target : 30 
    }else{
          var now_attr = parseInt( getComputedStyle(dom)[attr]);
    }
    clearInterval( dom.t );
    dom.t = setInterval( function(){
          var speed = (target - now_attr) / 10;
          speed = speed > 0 ? Math.ceil( speed ) : Math.floor( speed );
          if( target === now_attr ){
                clearInterval(dom.t);
          }else{
                now_attr += speed;
                // 判断透明度还有普通的属性; 
                if(attr === "opacity"){
                      dom.style[attr] = now_attr / 100 ;
                }else{
                      dom.style[attr] = now_attr + "px";
                }
          }
    } , 50)
}
next.onclick = function(){
    // t = setInterval(function(){
    //     speed += 5
    //     box.style.left = -speed + "px";
    // },1)
    // console.log(speed)
    move( box , "left" , "-1490" )
    last.style.display = "block"
    next.style.display = "none"
}
last.onclick = function(){
    // t = setInterval(function(){
    //     speed += 5
    //     box.style.left = -speed + "px";
    // },1)
    // console.log(speed)
    move( box , "left" , "0" )
    last.style.display = "none"
    next.style.display = "block"
}